$('#login').click(function(){
    $.modal({
        title: '登录',
        afterText: `
    <div class="list-block" style="margin: .5rem 0">
      <form action="/login" method="post">
        <ul>
          <li>
            <div class="item-content">
              <div class="item-media"><i class="icon icon-form-name"></i></div>
              <div class="item-inner">
                <div class="item-input">
                  <input type="text" name="username" class="input-username" placeholder="用户名或手机号">
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="item-content">
              <div class="item-media"><i class="icon icon-form-password"></i></div>
              <div class="item-inner">
                <div class="item-input">
                  <input type="password" name='password' class='input-password' placeholder="密码">
                </div>
              </div>
            </div>
          </li>
        </ul>
      </form>
    </div>
    `,
        buttons: [
            {
                text: "取消"
            },
            {
                text: '确定',
                onClick: function () {
                }
            },
        ]
    })
})

//$('#login-modal').removeClass('hide')
//$('.modal-overlay').addClass('modal-overlay-visible')


$('#register').click(function(){
    $.modal({
        title: '注册',
        afterText: `
    <div class="list-block" style="margin: .5rem 0">
      <form action="/login" method="post" id="register-form">
        <ul>
          <li>
            <div class="item-content">
              <div class="item-media"><i class="icon icon-form-name"></i></div>
              <div class="item-inner">
                <div class="item-input">
                  <input type="text" name="username" class="input-username" placeholder="用户名或手机号">
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="item-content">
              <div class="item-media"><i class="icon icon-form-password"></i></div>
              <div class="item-inner">
                <div class="item-input">
                  <input type="password" name='password' class='input-password' placeholder="设置密码">
                </div>
              </div>
            </div>
          </li>

          <li>
            <div class="item-content">
              <div class="item-media"><i class="icon icon-form-password"></i></div>
              <div class="item-inner">
                <div class="item-input">
                  <input type="password" name='repassword' class='input-re-password' placeholder="确认密码">
                </div>
              </div>
            </div>
          </li>

        </ul>
      </form>
    </div>
    `,
        buttons: [
            {
                text: "取消"
            },
            {
                text: '确定',
                onClick: function () {
                    $.ajax({
                        type:'post',
                        url:'/register',
                        data:$('#register-form').serialize(),
                        success:function(e){

                            $.closeModal();
                        }
                    })
                }
            },
        ]
    })
})